<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      lang="zh-cn">
<head>
    <meta content="云之讯,云通讯,云通讯平台" name="keywords"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"/>
    <title>短信云平台运营系统 </title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <link th:href="@{/resources/css/bootstrap.min14ed.css?v=3.3.6}" href="/resources/css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
    <link th:href="@{/resources/css/font-awesome.min93e3.css?v=4.4.0}" href="/resources/css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet"><!-- jqgrid-->
    <link th:href="@{/resources/js/plugins/jqgrid/css/ui.jqgrid-bootstrap.css}" href="/resources/js/plugins/jqgrid/css/ui.jqgrid-bootstrap.css" rel="stylesheet">
    <link th:href="@{/resources/css/animate.min.css}" href="/resources/css/animate.min.css" rel="stylesheet">
    <link th:href="@{/resources/css/style.min862f.css?v=4.1.0}" href="/resources/css/style.min862f.css?v=4.1.0" rel="stylesheet">
    <link th:href="@{/resources/css/plugins/sweetalert/sweetalert.css}" href="/resources/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
    <style>
        /* Additional style to fix warning dialog position */
        #alertmod_table_list_2 {
            top: 900px !important;
        }

        .modal-body input {
            width: 150px;
        }
    </style>
</head>
<body class="gray-bg"><div th:replace="stat :: statCode"></div>
<div class="wrapper wrapper-content  animated fadeInRight">

    <div class="row">
        <div class="col-sm-12">
            <div class="tabs-container">
                <input type="hidden" th:value="${jsmsMenu.menuId}" id="menuId">
                <ul class="nav nav-tabs">
                    <li class="" id="agentTab" th:if="${menus.ptdxxhbb}">
                        <a  th:href="@{/statistic/clientConsume2point3}" aria-expanded="true">普通短信消耗报表</a>
                    </li>
                    <li class="active" id="clientTab" th:if="${menus.gjdxxhbb}">
                        <!--<a data-toggle="tab" th:href="@{/statistic/directClientConsume}" id="rebateConfigPage" aria-expanded="false">直客消耗报表</a>-->
                        <a data-toggle="tab" href="#" id="rebateConfigPage" aria-expanded="false">国际短信消耗报表</a>
                    </li>
                </ul>
                <div class="tab-content">
                    <div id="tab-1" class="tab-pane active" th:if="${menus.gjdxxhbb}">
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="ibox ">
                                        <!-- 搜索条件 -->
                                        <div class="ibox-content">
                                            <form role="form" class="form-inline" id="mainForm">

                                                <div class="form-group m-r-md">
                                                    <label for="clientType">客户类型:</label>
                                                    <select id="clientType" class="form-control" name="clientType">
                                                        <option value="">全部</option>
                                                        <option value="1">代理商子客户</option>
                                                        <option value="0">直客</option>
                                                    </select>
                                                </div>
                                                <div class="form-group m-r-md">
                                                    <label for="departmentId">部门:</label>
                                                    <select id="departmentId" class="form-control" name="departmentId">
                                                        <option value="">全部</option>
                                                    </select>
                                                </div>
                                                <div class="form-group m-r-md">
                                                    <label for="smstype">短信类型:</label>
                                                    <select id="smstype" name="smstype" class="form-control">
                                                        <option value="">全部类型</option>
                                                        <option value="4">验证码</option>
                                                        <option value="0">通知</option>
                                                        <option value="5">营销</option>
                                                        <option value="8">闪信</option>
                                                        <option value="7">USSD</option>
                                                        <option value="6">告警</option>
                                                    </select>
                                                </div>
                                                <div class="form-group m-r-md">
                                                    <label for="paytype">付费类型:</label>
                                                    <select id="paytype" name="paytype" class="form-control">
                                                        <option value="">全部</option>
                                                        <option value="0">预付费</option>
                                                        <option value="1">后付费</option>
                                                    </select>
                                                </div>
                                                <!-- 时间选择 -->
                                                <div class="form-group m-r-md" id="sandbox-container">
                                                    <div class="form-group pull-right"><span
                                                            style="font-weight:700">时间:</span>
                                                        <input style="width: 180px;" placeholder="起始时间" name="startTime"
                                                               class="form-control layer-date" id="start_time_day"/>至
                                                        <input placeholder="截止时间" class="form-control layer-date" name="endTime"
                                                               id="end_time_day"/>
                                                    </div>
                                                </div>

                                                <div class="form-group" >
                                                    <input placeholder="客户ID/客户名称/代理商ID/销售名字" style="width:270px" class="form-control" id="condition" name="condition"/>
                                                </div>
                                                <div class="form-group pull-right m-r-md">
                                                    <button type="button" class="btn btn-sm btn-danger m-r-md" onclick="search()">搜索</button>
                                                    <button type="button" class="btn btn-sm btn-primary" onclick="exportExcel()">导出Excel</button>
                                                </div>
                                            </form>
                                        </div>

                                        <div class="ibox-content">
                                            <div class="jqGrid_wrapper">
                                                <table id="table_list"></table>
                                                <div id="pager_list"></div>
                                            </div>
                                            <p>&nbsp;</p>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div><!-- panel-body -->
                    </div><!-- tab-1 -->

                </div><!-- panel-body -->
            </div><!-- tab-2 -->
        </div><!-- tab-content -->
    </div><!-- tabs-container-->
</div><!-- col-sm-12 -->
</div><!-- row -->
</div>
<script th:src="@{/resources/js/jquery.min.js?v=2.1.4}"></script>
<script th:src="@{/resources/js/bootstrap.min.js?v=3.3.6}"></script>
<script th:src="@{/resources/js/content.min.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/plugins/layer/laydate/laydate.js}"></script>
<script th:src="@{/resources/js/plugins/peity/jquery.peity.min.js}"></script>
<script th:src="@{/resources/js/plugins/jqgrid/js/i18n/grid.locale-cn.js}"></script>
<script th:src="@{/resources/js/plugins/jqgrid/js/jquery.jqGrid.min.js}"></script>
<script th:src="@{/resources/js/date_format.min.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/plugins/sweetalert/sweetalert.min.js}"></script>
<script th:src="@{/resources/js/layer/layer.js}"></script>
<script th:src="@{/resources/js/plugins/validate/jquery.validate.min.js}"></script>
<script th:src="@{/resources/js/jquery.form.js?v=1.0.0}"></script>
<script th:src="@{/resources/js/common.js?v=1.0.0}"></script>

<script th:inline="javascript">
    /*<![CDATA[*/
    var max_export_num = [[${max_export_num}]];

    var start = {
        elem: "#start_time_day",
        format: "YYYY-MM-DD",
        min: halfYearAgo("yyyy-MM-dd"),
        max: laydate.now(),
        istoday: true,
        choose: function (datas) {
            end.min = datas;
        }
    };
    var end = {
        elem: "#end_time_day",
        format: "YYYY-MM-DD",
        min: halfYearAgo("yyyy-MM-dd"),
        max: laydate.now(),
        istoday: true,
        choose: function (datas) {
            start.max = datas;
        }
    };
    laydate(start);
    laydate(end);

    $("#start_time_day").val(laydate.now(-31));
    $("#end_time_day").val(laydate.now(-1));

    function search() {

        $("#table_list").jqGrid('setGridParam', {
            datatype: 'json',
            postData: {
                clientType: $("#clientType").val(),
                condition: $("#condition").val(),
                smstype: $("#smstype").val(),
                departmentId: $("#departmentId").val(),
                paytype: $("#paytype").val(),
                startTime: $("#start_time_day").val(),
                endTime: $("#end_time_day").val()
            }, //发送数据
//            page:1
        }).trigger("reloadGrid"); //重新载入
    }


    $(document).ready(function () {
        $.jgrid.defaults.styleUI = "Bootstrap";
        $("#table_list").jqGrid({
            url: /*[[@{/statistic/clientConsumeInter2point3}]]*/'',
            mtype: 'POST',
            datatype: "json",
            jsonReader: {
                root: "data",
                page: "pageNo",
                total: "totalPage",
                records: "totalRecord"
            },
            postData: {
                clientType: $("#clientType").val(),
                condition: $("#condition").val(),
                smstype: $("#smstype").val(),
                departmentId: $("#departmentId").val(),
                paytype: $("#paytype").val(),
                startTime: $("#start_time_day").val(),
                endTime: $("#end_time_day").val()
            },
            height: 'auto',
            rownumbers: true,
            autowidth: true,
            shrinkToFit: false,
            autoScroll: true,
            footerrow:true,
            rowNum: 20,
            rowList: [10, 20, 30, 50],
            colModel: [
                {label: "客户类型", name: "clientTypeStr", align: "left", sortable: false,width:'110'},
                {label: "部门", name: "departmentStr", align: "left", sortable: false,width:'110'},
                {label: "客户ID", name: "clientid", align: "left", sortable: false,width:'70'},
                {label: "客户名称", name: "accountGname", align: "left", sortable: false,width:'270'},
                {label: "所属代理商ID", name: "agentId", align: "left", sortable: false,width:'100',
                    formatter: function (cellvalue, options, rowObject) {
                        if(cellvalue==0)
                            return "-";
                        return cellvalue;
                    }
                },
                {label: "代理商名称", name: "agentName", align: "left", sortable: false,width:'80'},
                {label: "代理商类型", name: "agentTypeStr", align: "left", sortable: false,width:'100'},
                {label: "归属销售", name: "belongSaleStr", align: "left", sortable: false,width:'80'},
                {label: "付费类型", name: "paytypeStr", align: "left", sortable: false,width:'70'},
                {label: "计费规则", name: "chargeRuleStr", align: "left", sortable: false,width:'70'},
                {label: "短信类型", name: "smstypeStr", align: "left", sortable: false,width:'100'},
                {label: "提交条数（条）", name: "submitTotal", align: "left", sortable: false,width:'100'},
                {label: "计费条数（条）", name: "chargeTotal", align: "left", sortable: false,width:'100'},
                {label: "成功率（%）", name: "successRate", align: "left", sortable: false,width:'100'},
                {label: "成功条数（条）", name: "reportsuccess", align: "left", sortable: false,width:'100'},
                {label: "未知条数（条）", name: "submitsuccess", align: "left", sortable: false,width:'100'},
                {label: "失败条数（条）", name: "failTotal", align: "left", sortable: false,width:'100'},
                {label: "待发送条数（条）", name: "notsend", align: "left", sortable: false,width:'100'},
                {label: "拦截条数（条）", name: "interceptTotal", align: "left", sortable: false,width:'100'},
                {label: "消费金额（元）", name: "salefeeStr", align: "left", sortable: false,width:'100'},
                {label: "通道成本（元）", name: "costfeeStr", align: "left", sortable: false,width:'100'},
                {label: "毛利 （元）", name: "profit", align: "left", sortable: false,width:'100'},
                {label: "毛利率（%）", name: "profitRate", align: "left", sortable: false,width:'100'},
                {label: "未返还条数", name: "pendingReturnNumber", align: "left", sortable: false,width:'100',
                    formatter: function (cellvalue, options, rowObject) {
                        var paytype = rowObject.paytype;
                        if(paytype == 1){
                            return "-";
                        }
                        return cellvalue;
                    }
                },
                {label: "未返还计费", name: "pendingReturnAmountStr", align: "left", sortable: false,width:'100',
                    formatter: function (cellvalue, options, rowObject) {
                        var paytype = rowObject.paytype;
                        if(paytype == 1){
                            return "-";
                        }
                        return cellvalue;
                    }
                },
                {
                    label: "操作", name: "total", index: "total", align: "left", sortable: false, title: false,
                    formatter: function (cellvalue, options, rowObject) {
                        var clientid = rowObject.clientid;
                        var accountGname = rowObject.accountGname?rowObject.accountGname:'';
                        var smstype = rowObject.smstype;
                        var agentId = rowObject.agentId ? rowObject.agentId : '';
                        var agentName = rowObject.agentName ? rowObject.agentName : '';
                        var paytype = rowObject.paytype;
                        var belongSale = rowObject.belongSale ? rowObject.belongSale : '';
                        var belongSaleStr = rowObject.belongSaleStr ? rowObject.belongSaleStr : '';
                        var params = clientid + "','"+ accountGname + "','" + smstype + "','" + agentId + "','" + agentName + "','" + paytype + "','" + belongSale + "','" + belongSaleStr;
                        var switcher = "<button type='button' class='btn btn-link btn-xs hide' onclick=\"sendDetails('" + params + "')\" title='详情' data-menuId='6703'>发送详情</button>";
                        switcher += "<button type='button' class='btn btn-link btn-xs hide' onclick=\"channelDetails('"+params+"')\" title='下架' data-menuId='6704'>通道消耗详情</button>";
                        return switcher;
                    }
                }
            ],
            gridComplete: completeMethod,
            pager: "#pager_list",
            viewrecords: true,
            hidegrid: false
        });

        $(window).bind("resize", function () {
            var width = $(".jqGrid_wrapper").width();
            $("#table_list").setGridWidth(width);
        })


        function keyUp(e) {
            var currKey = 0, e = e || event;
            currKey = e.keyCode || e.which || e.charCode;
            var keyName = String.fromCharCode(currKey);
            if (currKey == 13) {
                search();
            }
        }

        document.onkeyup = keyUp;


        //冒泡提示
        $("#table_list_submitTotal").attr("title","(0+1+3+4+5+6+7+8+9+10)");
        $("#table_list_chargeTotal").attr("title","(根据计费规则取值)");
        $("#table_list_successRate").attr("title","(3/0+1+3+4+5+6+7+8+9+10)");
        $("#table_list_reportsuccess").attr("title","(3)");
        $("#table_list_submitsuccess").attr("title","(1)");
        $("#table_list_failTotal").attr("title","(4+6)");
        $("#table_list_notsend").attr("title","(0)");
        $("#table_list_interceptTotal").attr("title","（5+7+8+9+10)");
        $("#table_list_salefeeStr").attr("title","（计费条数*单价）");
        $("#table_list_costfeeStr").attr("title","（通道侧）");


    });

    //解决合计精度问题
    Math.add = function(v1, v2)
    {
        var r1, r2, m;
        try
        {
            r1 = v1.toString().split(".")[1].length;
        }
        catch (e)
        {
            r1 = 0;
        }
        try
        {
            r2 = v2.toString().split(".")[1].length;
        }
        catch (e)
        {
            r2 = 0;
        }
        m = Math.pow(10, Math.max(r1, r2));

        return (v1 * m + v2 * m) / m;
    };

    Number.toFixed = function(scale)
    {
        var s, s1, s2, start;

        s1 = this + "";
        start = s1.indexOf(".");
        s = s1.movePoint(scale);

        if (start >= 0)
        {
            s2 = Number(s1.substr(start + scale + 1, 1));
            if (s2 >= 5 && this >= 0 || s2 < 5 && this < 0)
            {
                s = Math.ceil(s);
            }
            else
            {
                s = Math.floor(s);
            }
        }

        return s.toString().movePoint(-scale);
    }

    //表格统计功能
    function completeMethod(){
        var menuId = $("#menuId").val();
        checkMenu(menuId);


        $.ajax({
            type : "post",
            url : /*[[@{/statistic/clientConsume2point3Total}]]*/,
            data : {
                clientType: $("#clientType").val(),
                condition: $("#condition").val(),
                smstype: $("#smstype").val(),
                departmentId: $("#departmentId").val(),
                paytype: $("#paytype").val(),
                startTime: $("#start_time_day").val(),
                endTime: $("#end_time_day").val(),
                isInter: "true"
            },
            success : function(result) {
                if(result.fail)
                    return;

                if(!result.data)
                    return;

                var data = result.data;
                var sum_submitTotal=data.submitTotal;
                var sum_chargeTotal=data.chargeTotal;
                var sum_successRate=data.successRate;
                var sum_reportsuccess=data.reportsuccess;
                var submitsuccess=data.submitsuccess;
                var sum_failTotal=data.failTotal;
                var sum_notsend=data.notsend;
                var sum_interceptTotal=data.interceptTotal;
                var sum_salefeeStr=data.salefeeStr;
                var sum_costfeeStr=data.costfeeStr;
                var sum_profit=data.profit;
                var sum_profitRate=data.profitRate;
                var sum_pendingReturnNumber=data.pendingReturnNumber;
                var sum_pendingReturnAmountStr=data.pendingReturnAmountStr;

                $("#table_list").footerData('set', { 'smstypeStr': '合计',
                    'submitTotal': sum_submitTotal,
                    'chargeTotal': sum_chargeTotal,
                    'successRate': sum_successRate,
                    'reportsuccess': sum_reportsuccess,
                    'submitsuccess': submitsuccess,
                    'failTotal': sum_failTotal,
                    'notsend': sum_notsend,
                    'interceptTotal': sum_interceptTotal,
                    'salefeeStr': sum_salefeeStr,
                    'costfeeStr': sum_costfeeStr,
                    'profit': sum_profit,
                    'profitRate': sum_profitRate,
                    'pendingReturnNumber':sum_pendingReturnNumber,
                    'pendingReturnAmountStr':sum_pendingReturnAmountStr
                });
            }

        });



    }


    function sendDetails(clientid,accountGname,smstype,agentId,agentName,paytype, belongSale, belongSaleStr) {
        var detailUrl = /*[[@{/statistic/sendDetail?}]]*/'';
        location.href = detailUrl +'isInter=true'+ '&clientid='+ clientid + '&_accountGname='+ encodeURI(encodeURI(accountGname))+ "&smstype=" + smstype + "&agentId=" + agentId + "&_agentName=" + encodeURI(encodeURI(agentName))+ "&agentName=" + agentName + "&paytype=" + paytype
            + "&belongSale=" + belongSale+ "&_belongSaleStr=" + encodeURI(encodeURI(belongSaleStr))+ "&startTime=" + $("#start_time_day").val()+ "&endTime=" + $("#end_time_day").val()  + "&_existAgent=true";
    }

    function channelDetails(clientid,accountGname,smstype,agentId,agentName,paytype, belongSale, belongSaleStr) {
        var detailUrl = /*[[@{/statistic/channelDetail?}]]*/'';
        location.href = detailUrl +'isInter=true'+ '&clientid='+ clientid + '&_accountGname='+ encodeURI(encodeURI(accountGname))+ "&smstype=" + smstype + "&agentId=" + agentId+ "&_agentName=" + encodeURI(encodeURI(agentName)) + "&paytype=" + paytype
            + "&belongSale=" + belongSale+ "&_belongSaleStr=" + encodeURI(encodeURI(belongSaleStr))+ "&startTime=" + $("#start_time_day").val()+ "&endTime=" + $("#end_time_day").val() + "&_existAgent=true";
    }

    //导出Excel文件
    function exportExcel() {
        var totalCount = $("#table_list").jqGrid('getGridParam', 'records');
        if (totalCount == 0) {
            layer.msg("共0条记录，将不导出Excel文件", {icon: 2});
            return;
        }
        if (totalCount > max_export_num) {
            layer.msg("导出Excel文件条数大于" + max_export_num + "条", {icon: 2});
            return;
        }
        var msg = "正在生成报表，请稍后...";
        layer.msg('<div style="color:#506470;font-family: "microsoft yahei","Arial Narrow",HELVETICA;">'+msg+'</div>', {icon: 16,shade: [0.5, '#f5f5f5'],scrollbar: false,offset: 'auto',time: 600000}) ;
        var options = {
            url:/*[[@{/statistic/exportClientConsume2point3}]]*/'',
            data:{
                departmentIdName:$("#departmentId").find("option:selected").text(),
                smstypeName:$("#smstype").find("option:selected").text(),
                paytypeName:$("#paytype").find("option:selected").text(),
                conditionName:$("#condition").text(),
                isInter: "true"
            },
            success : function(result) {
                layer.closeAll(); //疯狂模式，关闭所有层
                if(result == null){
                    layer.msg("导出错误，请稍后重试...", {icon:2});
                }else if(result.success == true){
                    var exportFileName = result.data;
                    var turnForm = document.createElement("form");
                    document.body.appendChild(turnForm);
                    turnForm.method = 'post';
                    turnForm.action = /*[[@{/statistic/downloadExcel}]]*/"";
                    //创建表单
                    var newElement = document.createElement("input");
                    newElement.setAttribute("name","exportFileName");
                    newElement.setAttribute("type","hidden");
                    newElement.setAttribute("value",exportFileName);
                    turnForm.appendChild(newElement);
                    turnForm.submit();
                }else{
                    layer.msg(result.msg, {icon:2});

                }
            },
            complete : function(XMLHttpRequest,status){

            },
            type : "post",
            async: true,
            timeout:30000
        };
        $("#mainForm").ajaxSubmit(options);
    }

    $(function () {

        $.ajax({
            url:/*[[@{/statistic/getAllDept}]]*/'',
            type:"POST",
            success:function(result){
                var opt = '<option value="">全部</option>';
                if(result.success == true){
                    var deptArr = result.data;
                    if(deptArr instanceof Array){
                        for(var i = 0; i < deptArr.length;i++){
                            if(!deptArr[i]){continue}
                            opt += '<option value="'+deptArr[i].departmentId+'">'+deptArr[i].departmentName+'</option>';
                        }
                    }else {
                        opt = '<option value="'+deptArr.departmentId+'">'+deptArr.departmentName+'</option>'
                    }
                }
                $("#departmentId").html(opt);
            }
        });
    })
    /*]]>*/
</script>
</body>
</html>